<!DOCTYPE html>
<html>
<head>
    <title>广东麻将 - Login</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=0"/>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/library/normalize.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/library/font-awesome.min.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/login.css') }}">
    <script src="{{ url_for('static', filename='js/library/modernizr-2.6.2.min.js') }}"></script>
    <script src="{{ url_for('static', filename='js/library/jquery-1.10.1.min.js') }}"></script>

</head>
<body>
<form method="post">
    {{ form.hidden_tag() }}
    <div class="login border-box">
        <div class="title">广东麻将</div>
        <br>
        <div class="form-row">
            <i class="icon-user"></i>{{ form.phone(placeholder="手机号码",type="text",class="border-box") }}
            <div id="form_err_phone">{{ form.errors.phone[0] if form.errors.phone }}</div>
        </div>

        <div class="form-row">
            <i class="icon-lock"></i>{{ form.password(placeholder="密码", class="border-box") }}
            <div id="form_err_password">{{ form.errors.password[0] if form.errors.password }}</div>
        </div>
        <div class="form-row">
            {{ form.sms_code(placeholder="验证码", maxlength=4,type="code",class="border-box") }}
            <button class="twitter border-box" style="display: inline-table" id="sms_btn" type="button">获取验证码</button>
            <div id="form_err_sms_code">{{ form.errors.sms_code[0] if form.errors.sms_code }}</div>
        </div>
        <div class="form-row">
            <input type="checkbox" id="remember-login"><label for="remember-login">记住我们</label>
        </div>
        <button class="submit" id="submit" type="submit">登录</button>
        <a href="#">忘记密码</a>
    </div>
</form>
<script type="text/javascript">
    $('#sms_btn').click(function () {
        var sms_url = '{{ url_for('login_route.send_sms') }}';
        $.get(sms_url, data = {'phone': $('#phone').val()}, function (data) {
            if (!data['status']) {
                alert('短信发送失败');
            }
        });
        return false;
    });

    $('[id^="form_err_"]').parent().find('input').focus(function () {
        var id = $(this).attr('id');
        $('#form_err_' + id).hide();
    });
</script>
</body>
</html>